/*重置样式*/
@media all{
    html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img {
        margin: 0;
        padding: 0;
        font-family: "微软雅黑", sans-serif;
    }

    ul, ol, li {
        list-style: none;
    }

    a, u {
        text-decoration: none;
    }

    img {
        display: block;
        border: 0;
    }

    * {
        box-sizing: border-box;
    }

    :root {
        --c_blueMain: #40c8fa;
        --c_highlight: #fadb14;
        --c_text: rgba(0, 204, 255, 0.3);
        --c_textWeek: #b4c1d5;
        --c_splitLine: #e9eef7;
    }

    html, body {
        /*background: #323a6e;*/
        height: 100%;
        color: var(--c_blueMain);
        background: url("../img/com/bg.png") 50% no-repeat;
        background-size: cover;
        /*min-width: 1200px;*/
    }
    h3,h4,h5{
        font-weight: normal;
    }

    button {
        outline: none;
    }

    #container {
        display: flex;
        flex-direction: column;
        margin: 0 auto;
        /*height: 100%;*/
        /*background: rgba(255,0,0,.2);*/
    }
}
/* 全局样式 */
@media all {
    .myBg {
        background-size: 100% 100%;
        background-origin: content-box;
        background-repeat: no-repeat;
    }
    strong{
        font-weight: normal;
        color: var(--c_blueMain);
        letter-spacing: .125rem;
    }
    h4{
        font-size: 1.125rem;
        letter-spacing: .125rem;
        color: #b3eefe;
    }
    h5{
        letter-spacing: .125rem;
    }
}
/* 图标 */
@media all {
    i{
        display: inline-block;
        width: 1.875rem;
        height: 1.875rem;
        margin: 0 .5rem;
        vertical-align: text-top;
        background-size: contain;
        background-repeat: no-repeat;
    }
    .icon { /*symbol图标专用*/
        margin-right: .5rem;
        width: 1.875rem;
        height: 1.875rem;
        vertical-align: -0.5em;
        fill: currentColor;
        overflow: hidden;
    }
    .icon-increase{
        background-image: url("../img/index/i_increase.png");
    }
    .icon-decrease{
        background-image: url("../img/index/i_decrease.png");
    }
    .icon-flat{
        background-image: url("../img/index/i_flat.png");
    }
    .icon-money1{
        background-image: url("../img/index/i_money1.png");
    }
    .icon-money2{
        background-image: url("../img/index/i_money2.png");
    }
    .icon-money3{
        background-image: url("../img/index/i_money3.png");
    }
    .icon-coins{
        background-image: url("../img/index/i_coins.png");
    }
    .icon-eventLight{
        background-image: url("../img/index/i_eventLight.png");
    }
    .icon-clock{
        background-image: url("../img/index/i_clock.png");
    }
    .icon-plane{
        background-image: url("../img/index/i_plane.png");
    }
    .icon-onDuty{
        background-image: url("../img/com/i_onDuty.png");
    }
}
/*头部*/
@media all {
    #mainHeader{
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 4.875rem;
        background-color: rgba(255,255,255,.15);
    }
    #mainHeader h1,
    h3{
        background: -webkit-linear-gradient(top,#eaffff,#59f5ee);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    #mainHeader h1{
        position: absolute;
        left: 50%;
        font-size: 2.375rem;
        transform: translateX(-50%);
    }

    #mainHeader .userInfo{
        margin-left: 3rem;
        padding: 1rem 2rem 1rem 1rem;
        font-size: 1.375rem;
        background-color: #0e1a4f;
    }
    #mainHeader .info{
        color: #fff;
    }
    #mainHeader ul.info>li{
        display: inline-block;
        vertical-align: middle;
        padding: 0 2.5rem;
    }
    #mainHeader ul.info>li:first-of-type{
        border-right: 0.0625rem solid;
        border-image: linear-gradient(to bottom,rgba(0,0,0,0),#ececec 40%,#ececec 60%,rgba(0,0,0,0) 100%) 0 1;
    }
    #mainHeader ul.info>li>ul{
        display: inline-block;
    }
/*    #mainHeader svg.icon{
        width: 3rem;
        height: 3rem;
    }*/
    #mainHeader #weatherIcon{
        vertical-align: top;
        width: 3rem;
        height: 3rem;
        filter: brightness(3);
        background-size: contain;
        /*background-image: url("https://cdn.heweather.com/cond_icon/101.png");*/
    }
    #mainHeader .timeBox>span{
        display: block;
        text-align: center;
    }
    #mainHeader .timeBox>.time{
        font-size: 1.25rem;
        letter-spacing: .125rem;
    }
    #mainHeader .timeBox>.date{
        font-size: .875rem;
        letter-spacing: .0625rem;
    }

    #mainHeader> *{

    }
}











